import { getStudyCardConfig, saveStudyCardConfigNew } from '@/api/OfflineStudy';
import { useAppSelector } from '@/redux/store';
import { Button, Form, InputNumber, message, Radio, Select } from 'antd';
import { useEffect, useState } from 'react';
const requireRules = (text: string) => {
  return [{ required: true, message: text }];
};
const formItemLayout = {
  labelCol: { span: 3 },
  wrapperCol: { span: 10 },
};
export default function StudyCardRules() {
  const [form] = Form.useForm();
  const { entId, organizationType } = useAppSelector((state) => state.loginEnt); //organizationType 1:协会，0：企业
  const { Option } = Select;
  const [expiType, setExpiType] = useState<string>('2');
  const [renewType, setRenewType] = useState<string>('2');
  const selectExpi = (
    <Select
      value={expiType}
      onChange={(e) => {
        setExpiType(e);
      }}
    >
      <Option value="3">年</Option>
      <Option value="2">月</Option>
      <Option value="1">日</Option>
    </Select>
  );
  const selectRenew = (
    <Select
      value={renewType}
      onChange={(e) => {
        setRenewType(e);
      }}
    >
      <Option value="3">年</Option>
      <Option value="2">月</Option>
      <Option value="1">日</Option>
    </Select>
  );
  const submit = () => {
    form.validateFields().then((values) => {
      const typeVal1 = expiType == '3' ? 365 : expiType == '2' ? 30 : 1;
      const typeVal2 = renewType == '3' ? 365 : renewType == '2' ? 30 : 1;
      console.log(values.renewalTime, typeVal2, values.expirationTime, typeVal1, '打印看看怎么说');
      if (values.renewalTime * typeVal2 >= values.expirationTime * typeVal1)
        return message.error('“到期前多久可续期”需小于“学习卡有效期”');
      const params = { ...values };
      params.expirationType = expiType;
      params.renewalType = renewType;
      console.log(params, '打印看看表单数据');
      params.entId = entId;
      saveStudyCardConfigNew(params).then((res: any) => {
        const { code } = res;
        if (code === '200') {
          message.success('保存成功');
        }
      });
    });
  };
  useEffect(() => {
    getStudyCardConfig(entId).then((res: any) => {
      // const ddd = {
      //   data: {
      //     isOpen: 1,
      //     expirationType: '3',
      //     expirationTime: 16,
      //     renewalType: '2',
      //     renewalTime: 15,
      //   },
      // };
      // const { data } = ddd;
      const { data } = res;
      const { isOpen, expirationTime, renewalTime } = data;
      setExpiType(data.expirationType ? data.expirationType.toString() : '2');
      setRenewType(data.renewalType ? data.renewalType.toString() : '2');
      form.setFieldsValue({ isOpen, expirationTime, renewalTime });
    });
  }, []);
  return (
    <div className="safe_edu_page">
      <div
        style={{
          height: '100%',
          padding: 16,
          minHeight: 380,
        }}
      >
        <div>基础信息</div>
        <Form style={{ margin: 24 }} layout="horizontal" labelAlign="right" form={form} {...formItemLayout}>
          <Form.Item label="学习卡是否启用" name="isOpen" rules={requireRules('请选择')}>
            <Radio.Group>
              <Radio value={1}>是</Radio>
              <Radio value={0}>否</Radio>
            </Radio.Group>
          </Form.Item>
          <Form.Item label="学习卡有效期" name="expirationTime" rules={requireRules('请输入')}>
            <InputNumber
              style={{ width: 200 }}
              minLength={1}
              min={1}
              precision={0}
              placeholder="请输入"
              maxLength={99}
              addonAfter={selectExpi}
            />
          </Form.Item>
          <Form.Item label="到期前多久可续期" name="renewalTime" rules={requireRules('请输入')}>
            <InputNumber
              style={{ width: 200 }}
              minLength={1}
              min={1}
              precision={0}
              placeholder="请输入"
              maxLength={99}
              addonAfter={selectRenew}
            />
          </Form.Item>
        </Form>
        <Button
          type="primary"
          style={{ marginLeft: 158.13 }}
          onClick={() => {
            console.log(12);
            submit();
          }}
        >
          提交
        </Button>
      </div>
    </div>
  );
}
